<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">

	<head>
		<meta charset="UTF-8">
		<title>登录</title>
		<style type="text/css">
			* {
				padding: 0;
				margin: 0;
			}
			
			a {
				text-decoration: none
			}
			
			body {
				background-color: #EE9611;
				position: relative;
			}
			
			.login {
				position: absolute;
				margin-top: 20%;
				margin-left: 50%;
				transform: translateX(-50%);
				width: 70%;
				height: 500px;
				background: #FFFFFF;
				border-radius: 10px;
				display: flex;
				flex-direction: column;
				justify-content: space-between;
				align-items: center;
			}
			
			.login>div {
				width: 100%;
			}
			
			.login>.dc-head {
				height: 20%;
				display: flex;
				justify-content: center;
				align-items: center;
				font-family: "microsoft yahei";
				font-size: 40px;
				color: #999999;
				border-bottom: 1.5px solid gainsboro;
			}
			
			.login>.dc-body {
				padding-top: 10px;
				height: 60%;
				display: flex;
				flex-direction: column;
				justify-content: flex-start;
				align-items: center;
				font-family: "microsoft yahei";
				font-size: 40px;
				color: #999999;
				border-bottom: 1.5px solid gainsboro;
			}
			
			.login>.dc-body>img {
				display: inline-block;
				width: 50px;
				height: 50px;
				border-radius: 50%;
				margin-bottom: 3%;
				margin-top: 2%;
			}
			
			.login>.dc-body>p {
				margin-top: 2%;
			}
			
			input[name='userinfo'] {
				margin-right: 10px;
			}
			
			.login>.dc-footer {
				height: 20%;
				display: flex;
				justify-content: space-between;
				align-items: center;
				font-family: "microsoft yahei";
				font-size: 40px;
				color: #999999;
				border-bottom: 1.5px solid gainsboro;
			}
			
			.dc-footer>div {
				width: 50%;
				height: 100%;
				border: 1.5px solid gainsboro;
				display: flex;
				flex: 1;
				justify-content: center;
				align-items: center;
			}
		</style>
	</head>

	<body>

		<div class="login">
			<div class="dc-head">
				微信授权
			</div>
			<div class="dc-body">
				<img src="http://wx.qlogo.cn/mmopen/XLTLfw9FVc4k8UDsnOlfQ77wPDcwYNicucYh6P6qDrN4ngHPgeWsDnQ20NNekicUrsiaX1ic5Rfcl1vKvDbR7zKE3Jjh9UTZu2Vr/64" alt="" />
				<p style="color: black;">鼎昌充值申请获取以下权限</p>
				<p><label><input name="userinfo" type="radio" value=""  checked="checked"/>获得你的公开信息（昵称，头像等） </label> </p>
			</div>
			<div class="dc-footer">
				<div>
					<a href="" style="color: black;font-weight: 600;">拒绝</a>
				</div>
				<div>
					<a href="https://open.weixin.qq.com/connect/oauth2/authorize?appid=wx5ab17609a2d3fece&redirect_uri=http://xhccl.iok.la/v1/weChar/getCode&response_type=code&scope=snsapi_userinfo&state=STATE#wechat_redirect" style="color: #00CC00;font-weight: 600;">允许</a>
				</div>
			</div>

		</div>

	</body>
	<script type="text/javascript">
	</script>

</html>